<%-- <%@ include file="/common/taglibs.jsp"%>

<script type="text/javascript" src="<c:url value='/scripts/cip/fancybox/jquery.mousewheel-3.0.4.pack.js'/>"></script>
<script type="text/javascript" src="<c:url value='/scripts/cip/fancybox/jquery.fancybox-1.3.4.pack.js'/>"></script>

<link rel="stylesheet" type="text/css" href="<c:url value='/styles/cip/fancybox/jquery.fancybox-1.3.4.css'/>" media="screen" />

<script type="text/javascript">
	$(document).ready(function() {
		$("a[rel=example_group]").fancybox({
			'transitionIn'		: 'none',
			'transitionOut'		: 'none',
			'titlePosition' 	: 'over',
			'titleFormat'		: function(title, currentArray, currentIndex, currentOpts) {
				return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') + '</span>';
			}
		});
	});
</script>

<div id="content">
	<p>
		<s:iterator value="albums" status="rowstatus">
			<s:iterator value="albumPictures" status="rowstatus">
				<a rel="example_group" href="${name}" title="Lorem ipsum dolor sit amet" style="width: 60px;height: 60px;"><img alt="jec" width="120" height="120" src="${name}" /></a>
			</s:iterator>
		</s:iterator>
		
		<!-- Image gallery (ps, try using mouse scroll wheel)<br />
		<a rel="example_group" href="/images/cip/fancybox/example/9_b.jpg" title="Lorem ipsum dolor sit amet"><img alt="" src="/images/cip/fancybox/example/9_s.jpg" /></a>

		<a rel="example_group" href="/images/cip/fancybox/example/10_b.jpg" title=""><img alt="" src="/images/cip/fancybox/example/10_s.jpg" /></a>

		<a rel="example_group" href="/images/cip/fancybox/example/11_b.jpg" title=""><img alt="" src="/images/cip/fancybox/example/11_s.jpg" /></a>
		
		<a rel="example_group" href="/images/cip/fancybox/example/12_b.jpg" title=""><img class="last" alt="" src="/images/cip/fancybox/example/12_s.jpg" /></a> -->
	</p>
</div>
 --%>